<template>
  <div class='appfather'>
    <el-row class="tac">
      <el-col :span="12" class='tacol'>
        <el-menu :default-active="$route.path" class="el-menu-vertical-demo" :default-openeds='arr' router='true' @open="handleOpen" @close="handleClose" background-color="#252834" text-color="#9196a8" active-text-color="#fff" unique-opened='true'>
          <el-menu-item index="/index">
            <div @click='close'>
              <span class="iconfont-side icon-side-shouye"></span>
              <span slot="title">首页</span>
            </div>
          </el-menu-item>
          <el-submenu index="1">
            <template slot="title">
                <span class="iconfont-side icon-side-caiwu"></span>
                <span>财务中心</span>
            </template>
            <el-menu-item-group>
              <el-menu-item index="/financial">财务汇总</el-menu-item>
              <el-menu-item index="/capitaldetails">资金明细</el-menu-item>
              <el-menu-item index="/dailyPerformance">每日业绩</el-menu-item>
            </el-menu-item-group>
          </el-submenu>
          <el-submenu index="2">
            <template slot="title">
                <span class="iconfont-side icon-side-yonghu"></span>
                <span>服务中心</span>
            </template>
            <el-menu-item-group>
              <el-menu-item index="/forward">建仓管理(RST)</el-menu-item>
              <el-menu-item index="/delivery">提货管理</el-menu-item>
              <el-menu-item index="/investment">复投管理</el-menu-item>
              <el-menu-item index="/servicecentre">提现管理</el-menu-item>
            </el-menu-item-group>
          </el-submenu>
          <el-submenu index="3">
            <template slot="title">
                <span class="iconfont-side icon-side-huiyuan"></span>
                <span>会员中心</span>
            </template>
            <el-menu-item-group>
              <el-menu-item index="/extension">推广列表</el-menu-item>
              <el-menu-item index="/ReferralLinks">推广链接</el-menu-item>
            </el-menu-item-group>
            <!-- <el-menu-item-group title="分组2">
              <el-menu-item index="1-3">选项3</el-menu-item>
            </el-menu-item-group> -->
          </el-submenu>
          <el-submenu index="4">
            <template slot="title">
                <span class="iconfont-side icon-side-buoumaotubiao25"></span>
                <span>消息中心</span>
            </template>
            <el-menu-item-group>
              <el-menu-item index="/inbox_table">收件箱</el-menu-item>
              <el-menu-item index="/hairbox">发件箱</el-menu-item>
              <el-menu-item index="/Write">写信</el-menu-item>
              <el-menu-item index="/AnnouncementList">公告</el-menu-item>
              <el-menu-item index="/newsList">资讯</el-menu-item>
            </el-menu-item-group>
          </el-submenu>
        </el-menu>

        <div class="line"></div>
      </el-col>
    </el-row>
  </div>
</template>
<script>
import $ from "jquery";
export default {
  data() {
    return {
      arr: ["0"]
    };
  },
  mounted() {},
  methods: {
    handleOpen(index, indexPath) {
    },
    close() {
        this.arr = ["0"];
    }
  }
};
</script>
<style lang='less' scoped>
.tac {
  height: 100%;
}
.appfather {
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  &::-webkit-scrollbar {
    background-color: transparent;
    width: 0px;
  }
}
.tacol {
  width: 241px;
  height: 100%;
  > .el-menu {
    height: 100%;
    padding-top: 20px;
    .iconfont-side {
      padding-right: 25px;
      font-size: 18px;
    }
    .el-menu-item {
      padding-left: 50px !important;
      span {
        font-size: 18px;
      }
    }
    .el-submenu {
      span {
        font-size: 18px;
      }
      .el-menu-item-group {
        .el-menu-item {
          font-size: 16px;
          padding-left: 93px !important;
        }
      }
    }
  }
}
</style>

